<template>
  <div class="specialNurse-container">
    <babyRadio
      :margin-right="10"
      :res-val.sync="commodity_id"
      :items.sync="customList"
      :margin-bottom="20"
      :fix-width="200"
    ></babyRadio>
    <NoContent v-show="customList.length === 0"></NoContent>
  </div>
</template>
<script>
import babyRadio from '@/components/common/babyRadio/babyRadio';
import NoContent from '@/components/evaluation/NoContent.vue';

export default {
  components: {
    babyRadio,
    NoContent
  },
  props: {
    id: {}
  },
  data() {
    return {
      customList: [],
      commodity_id: 0
    };
  },
  watch: {
    id: {
      handler(v) {
        if (v) {
          this.getCustomList();
        }
      },
      immediate: true
    }
  },
  methods: {
    getCustomList() {
      this.$http(this.$url.getCustomList)
        .then(res => {
          if (!res) return;
          res.forEach(it => {
            it.label = it.commodity_name;
            it.value = it.id;
          });
          this.customList = res;
        })
        .catch(this.$catch);
    }
  }
};
</script>
<style lang="scss" scoped>
.specialNurse-container {
  background-color: #fff;
  padding: 20px 10px;
  font-size: 16px;
}
</style>
